<%-- 
    Document   : popupEditContact
    Created on : Jun 8, 2012, 2:04:30 PM
    Author     : VANANH
--%>

<%@page contentType="text/html" pageEncoding="UTF-8"%>
<%@taglib prefix="f" uri="http://java.sun.com/jsf/core" %>
<%@taglib prefix="h" uri="http://java.sun.com/jsf/html" %>
<%@taglib prefix="rich" uri="http://richfaces.org/rich" %>
<%@taglib prefix="a4j" uri="http://richfaces.org/a4j" %>
<%@taglib prefix="c" uri="http://java.sun.com/jstl/core_rt" %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">
<f:view>
    <html>
        <head>
            <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
            <link rel="stylesheet" type="text/css" href="../css/popup.css"/> 
            <link rel="stylesheet" type="text/css" href="../css/kapiform.css"/> 
            <script type="text/javascript" language="javascript" src="../scripts/jQuery/kapi.js"></script>
            <script type="text/javascript" language="javascript">
                var open_cur = 0;
                $j = jQuery.noConflict();
                $j(document).ready(function(){
              
           
           
                    var b = location.pathname;
                    $j("input[id$='message']").val(b);
                    //add email
                    var countm = 0;
                    var countt = 0;
                    var countf = 0;
                    //Truong hop thog             tin lien lac = null
                    var nv962 = '<h:outputText value="#{contactController.nv962}"/>';
                    var nv963 = '<h:outputText value="#{contactController.nv963}"/>';
                    var nv959 = '<h:outputText value="#{contactController.nv959}"/>';
                    var nv960 = '<h:outputText value="#{contactController.nv960}"/>';
                    var nv965 = '<h:outputText value="#{contactController.nv965}"/>';
                    var nv966 = '<h:outputText value="#{contactController.nv966}"/>';
       
                    var template_m1 = '<h:inputText value="#{contactController.nv962}" styleClass="input_mobi1  template_input"/>';
                                
                    var template_m2 = '<h:inputText value="#{contactController.nv963}" styleClass="input_mobi2  template_input"/>'; 
                    
                    //------------------------------            -------------------
                    var template_t1 = '<h:inputText value="#{contactController.nv959}" styleClass="input_tel1  template_input"/>'; 
                               
                    var template_t2 = '<h:inputText value="#{contactController.nv960}" styleClass="input_tel2   template_input"/>'; 
                    
                    //---------------------------------------            -------------------
                    var template_f1 = '<h:inputText value="#{contactController.nv965}" styleClass="input_fax1    template_input"/>'; 
                                
                    var template_f2 = '<h:inputText value="#{contactController.nv966}" styleClass="input_fax2    template_input"/>'; 
                    
                    //alert('mobile2: '+nv962.length + '  mobile3: '+nv963.length + '  Tel2: '+nv959.length+ '   Tel3: '+nv960.length + '  fax2: '+nv965.length + ' fax3: '+nv966.length);
                    if(nv962.length>0){
                        $j('.mobi_copy').append(template_m1);  
                    }
                    if(nv963.length>0){
                        $j('.mobi_copy').append(template_m2);  
                    }
                    if(nv959.length>0){
                        $j('.tel_copy').append(template_t1);  
                    }
                    if(nv960.length>0){
                        $j('.tel_copy').append(template_t2);  
                    }
                    if(nv965.length>0){
                        $j('.fax_copy').append(template_f1);  
                    }
                    if(nv966.length>0){
                        $j('.fax_copy').append(template_f2);  
                    }
                    if(nv962.length==0||nv963.length==0){
                        template_m1+='<span class="delm1 del"><img src="../images/delete_1.png" alt=""/></span>';
                        template_m2+='<span class="delm2 del"><img src="../images/delete_1.png" alt=""/></span>';
                        $j(".add_tab").live("click",function(){
                            
                            countm++;                            
                            if(!$j(".template_input").hasClass('input_mobi1')){
                                $j('.mobi_copy').append(template_m1);                                 
                            }else
                                if(!$j(".template_input").hasClass('input_mobi2')){
                                    $j('.mobi_copy').append(template_m2); 
                                }
                            
                        
                 
                        });
                        $j(".delm1").live("click",function(){                       
                            $j(".input_mobi1").remove();
                            $j(this).remove();
                            countm = 0;
                        });
                        $j(".delm2").live("click",function(){                       
                            $j(".input_mobi2").remove();
                            $j(this).remove();
                            countm = 0;
                        });
                    }
                   
                    if(nv959.length==0 || nv960.length==0){
                        template_t1+='<span class="delt1 del"><img src="../images/delete_1.png" alt=""/></span>';
                        template_t2+='<span class="delt2 del"><img src="../images/delete_1.png" alt=""/></span>';
                        $j(".add_tabt").live("click",function(){
                        
                            countt++;
                           
                            if(!$j(".template_input").hasClass('input_tel1')){
                                $j('.tel_copy').append(template_t1);
                            }                          
                            else
                                if(!$j(".template_input").hasClass('input_tel2')){
                                    $j('.tel_copy').append(template_t2);
                                }
                            
                           
                        
                 
                        });
                        $j(".delt1").live("click",function(){                       
                            $j(".input_tel1").remove();
                            $j(this).remove();
                            countt = 0;
                        });
                        $j(".delt2").live("click",function(){                       
                            $j(".input_tel2").remove();
                            $j(this).remove();
                            countt = 0;
                        });
                    }
                    if(nv965.length==0 || nv966.length==0){
                        template_f1+='<span class="delf1 del"><img src="../images/delete_1.png" alt=""/></span>';
                        template_f2+='<span class="delf2 del"><img src="../images/delete_1.png" alt=""/></span>';
                        $j(".add_tabf").live("click",function(){
                        
                            countf++;
                            
                            if(!$j(".template_input").hasClass('input_fax1')){
                                $j('.fax_copy').append(template_f1);
                            }
                              
                            else
                           
                            if(!$j(".template_input").hasClass('input_fax2')){
                                $j('.fax_copy').append(template_f2);
                            }
                           
                    
                 
                    });
                    $j(".delf1").live("click",function(){                       
                        $j(".input_fax1").remove();
                        $j(this).remove();
                        countf = 0;
                    });
                    $j(".delf2").live("click",function(){                       
                        $j(".input_fax2").remove();
                        $j(this).remove();
                        countf = 1;
                    });
                }
       
       

            });
            </script>
            <style type="text/css">
                .template_input{
                    float: left !important;
                    margin-left: 68px !important;
                    margin-top: 5px;
                }
                .edit_form_right {
                    float: left;
                    height: 230px;
                    overflow: auto;
                    overflow-x: hidden; 
                    
                    
                    width: 310px !important;
                }
                .del{
                    float:left;
                    margin-top:9px;
                }
                .fields_input span img{
                    float:left;
                    width:15px;
                    height:15px;
                }
                .fields_input{
                    margin-top: 6px!important;
                    margin-left:10px !important;
                    width: 97% !important;
                }

                .field_normal{            
                    width:100%; 
                }
                .field_pink{
                    background-color: #D1E1F1; 

                }
                .form_item_content{
                    margin-left: 0px !important;
                }
            </style>
        </head>

        <body style=" float:left; width:auto; height:auto; margin:0px;">

            <f:loadBundle basename="#{environmentSession.localizationSource}" var="locale"/>
            <a4j:form id="formN950V">
                <div class="popup" style="height:380px; width:600px">
                    <div class="popup-header">
                        <div class="title"><h:outputText value="#{locale.update_contact}"/></div>
                    </div>
                    <div class="popup-content">
                        <div class="main_content">
                            <div class="form_item_content" style="display: block;">
                                <div class="field_pink" style="height:90px; " >
                                    <div class="edit_form_left">

                                        <div class="fields_input">
                                            <label><h:outputText value="#{locale.address}"/>*:</label>                                                
                                            <h:inputText value="#{contactController.nv952}" id="address" styleClass="required">
                                            </h:inputText>
                                        </div>
                                        <div class="fields_input">
                                            <label><h:outputText value="#{locale.ward}"/>:</label>
                                            <h:inputText value="#{contactController.nv954}"/>
                                        </div>
                                        <div class="fields_input">
                                            <label><h:outputText value="#{locale.district}"/>:</label>
                                            <h:inputText value="#{contactController.nv955}"/>
                                        </div>

                                        <div class="fields_input">
                                            <label><h:outputText value="#{locale.city}"/>:</label>
                                            <h:inputText value="#{contactController.nv957}"/>
                                        </div>
                                        <div class="fields_input copy_email">
                                            <label><h:outputText value="#{locale.email}"/>:</label>
                                            <h:inputText value="#{contactController.nv967}" styleClass="email"/>
                                        </div> 
                                        <div class="fields_input">
                                            <label><h:outputText value="#{locale.skype}"/>:</label>
                                            <h:inputText value="#{contactController.nv968}"></h:inputText>
                                            </div>
                                            <div class="fields_input">
                                                <label><h:outputText value="#{locale.yahoo}"/>:</label>
                                            <h:inputText value="#{contactController.nv969}"></h:inputText>         
                                            </div> 
                                        </div>

                                        <div class="edit_form_right">
                                            <div class="fields_input mobi_copy">
                                                <label><h:outputText value="#{locale.mobile}"/>:</label>
                                            <h:inputText value="#{contactController.nv961}"  styleClass="number" />
                                            <span class="add_tab"><img src="../images/add_tab.png" alt=""/></span>

                                        </div>
                                        <div class="fields_input tel_copy">
                                            <label><h:outputText value="#{locale.tel}"/>:</label>
                                            <h:inputText value="#{contactController.nv958}"  styleClass="number required" id="tel">
                                            </h:inputText>
                                            <span class="add_tabt"><img src="../images/add_tab.png" alt=""/></span>
                                        </div>
                                        <div class="fields_input fax_copy">
                                            <label><h:outputText value="#{locale.fax}"/>: </label>
                                            <h:inputText value="#{contactController.nv964}" styleClass="number" >
                                            </h:inputText>
                                            <span class="add_tabf"><img src="../images/add_tab.png" alt=""/></span>
                                        </div>
                                    </div>
                                </div>

                            </div>
                            <div class="alert">      </div>
                        </div>

                    </div>
                    <div class="popup-footer">
                        <div class="buttonsave" style="margin-right: 66px;" onclick="jQuery.fancybox.close()"><span><h:outputText value="#{locale.close}"/></span></div>
                        <h:commandButton  action="#{contactController.saveN950new}" value="#{locale.save}" styleClass="buttonsave">
                            <f:param value="#{contactController.pn950}" name="pn950"></f:param>
                            <f:param value="#{contactController.fn100}" name="fn100"></f:param>  
                            <f:param value="#{contactController.pagereload}" name="page"></f:param> 
                        </h:commandButton>
                        <h:inputHidden value="#{contactController.pagereload}" id="pagereload"/>
                        <h:inputHidden value="#{contactController.pn950}" id="pn950"/>
                        <h:inputHidden value="#{contactController.fn100}" id="fn100"/>
                        <h:inputHidden value="#{contactController.table}" id="table"/>
                        <h:inputHidden value="#{contactController.table1}" id="table1"/>
                        <h:inputHidden value="#{contactController.flagedit}" id="flagedit"/>
                    </div>
                </div>
            </a4j:form>

        </body>
    </html>
    <script type="text/javascript">
    $j(document).ready(function(){
        yhight = ($j('.popup').height()-90)+"px" ;
        $j('.main_content').css('height',yhight );
        $j('.popup-content').css('height',yhight );
    });
    </script>
</f:view>